import { Breadcrumb as AntBreadcrumb, Icon } from "antd";
import * as React from "react";
import { Link } from "react-router-dom";

export default function Breadcrumb({pathConfig}) {
  const { module: moduleSetting, menu, subMenuName } = pathConfig;
  return (
    <AntBreadcrumb separator=">">
      {moduleSetting.id && (
        <AntBreadcrumb.Item key={moduleSetting.id}>
          <Icon type={moduleSetting.icon} />
          <span>{moduleSetting.name}</span>
        </AntBreadcrumb.Item>
      )}
      {menu.id && (
        <AntBreadcrumb.Item key={menu.id}>
          <Link to={`/${menu.link}`}>
            <span>{menu.name}</span>
          </Link>
        </AntBreadcrumb.Item>
      )}
      {subMenuName && (
        <AntBreadcrumb.Item key={subMenuName}>
          <span>{subMenuName}</span>
        </AntBreadcrumb.Item>
      )}
    </AntBreadcrumb>
  );
}
